<!doctype html>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="telephone=no" />
	<title>首页</title>
	<link rel="stylesheet" type="text/css" href="../c/aui.css" />
	<style>
		body {
			background-color: transparent;
			background-color: #000;
		}

		.index .text {
			position: absolute;
			bottom: 0;
			left: 0;
			background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.5));
			background-image: -o-linear-gradient(rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.5));
			background-image: linear-gradient(rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.5));
			padding: 0.75rem;
			width: 100%;
			font-size: 0.7rem;
			border-radius: 0.5rem;
		}

		.t {
			position: absolute;
			top: 0.5rem;
			left: 0.5rem;
			font-size: 0.6rem;
			padding: 0.05rem 0.25rem;
			border-radius: 0.1rem;
			background-image: -webkit-linear-gradient(left, rgba(169, 82, 161, 0.5), rgba(181, 56, 112, 0.5), rgba(239, 119, 120, 0.5));
		}

		.index .aui-row {
			margin: 0.2rem;
		}

		.index .aui-col-xs-6 .l {
			margin: 0.2rem;
		}

		.index .aui-col-xs-6 img {
			width: 100%;
			height: 100%;
			border-radius: 0.5rem;
			background: #333;
		}
		.tags{
			display: flex;
			justify-content:center;
			align-items: center;
			/*background: #999;*/
			margin: 0.75rem;

		}
		.tags div{
			font-size: 0.75rem;
			margin: 0 1rem;
		}
		.tags div.a{
			/*color: #FE2C55;*/
			/*-webkit-transition: all .3s;
			transition: all .3s;*/
			/*border-bottom: 1px solid #fff;*/
			background: #FE2C55;
			display: inline-block;
			padding: 0.15rem 0.35rem;
			border-radius: 0.25rem;
		}
		.tags div.b{
			width: 1px;
			background: #f9f9f9;
			height: 0.75rem;
			display: inline-block;
			padding: 0;
			margin: 0;
		}
	</style>
</head>

<body>
	<div class="tags">
		<div class="a" tapmode onclick="a(this)" data-url='zhibo/lists_zhibo'>推荐直播</div>
		<div tapmode onclick="a(this)" data-url='zhibo/lists'>新人直播</div>
	</div>
	<section class="index">
		<script id="sx-list" type="text/x-dot-template">
			{{ for(var i=0,it=it.data; i < it.length; i++) { }}
			<div class="aui-col-xs-6">
				<div class="l" tapmode onclick="_zurl_data(this)" data-data='{{= JSON.stringify(it[i]) }}'>
					{{? !it[i].url}}
					<img suxiangw-src="{{= _img(it[i].img_l,200)}}" src="../i/loading_200.png" />
					{{??}}
					<img suxiangw-src="{{= it[i].img_l }}" style="height:{{= api.winWidth/2}}px" src="../i/loading_200.png" />
					{{?}}
					<div class="text aui-ellipsis-1">
						{{= it[i].roomName}}
					</div>
				</div>
			</div>
			{{ } }}
		</script>
		<div class="aui-row" id="sx-view"><div id="loadingdi_huifu" style="padding-top:50%"><img src="../i/footer_progress.png" /></div></div>
	</section>
</body>

<script type="text/javascript" src="../j/api.js"></script>
<script type="text/javascript">
	var url = 'zhibo/lists_zhibo';
	apiready = function() {
		api.execScript({
				frameName: 'index_header',
				script: 'header("zhibo_index");'
		});
		if(api.pageParam['index'] == 1){
			url = 'zhibo/lists';
		}
		_list({url:url,loading:1});
		if(url == 'zhibo/lists_zhibo'){
			setTimeout(function(){
				pagenum += 1
				_list({url:url,page:pagenum});
			},300)
		}
		// $api.fixStatusBar($api.dom('.tags'));
		_shangla(function(ret,err){
			_list({url:url,loading:1});
			if(url == 'zhibo/lists_zhibo'){
				setTimeout(function(){
					pagenum += 1
					_list({url:url,page:pagenum});
				},300)
			}
		},1)
		zhibo_liwu_img();
		// 监听滚动
		api.addEventListener({
			name : 'scrolltobottom',
			extra : {
				threshold : api.winHeight //设置距离底部多少距离时触发，默认值为0，数字类型
			}
		}, function(ret, err) {
			if (heigutgao == 1) {// heigutgao=1开启执行 0停止执行   防止连续滚动，等加载数据之后在进行滚动。
				pagenum += 1
				_list({url:url,page:pagenum});
			}
		});
		// 回到屏幕
		api.addEventListener({
			name : 'viewappear'
		}, function(ret, err) {
			api.setFullScreen({
				fullScreen : false
			});
		});
		// 应用从后台回到前台事件
		api.addEventListener({
			name : 'resume'
		}, function(ret, err) {
			api.setFullScreen({
				fullScreen : false
			});
		});
	}
	function _zurl_data(_this) {
		if (!_getPrefs('_user')) {
			return _login();
		}
		var data = $(_this).data('data');
		if(data.uid == _getPrefs('_user').id){
			if (_getPrefs('_config').vip.zhibo && !_getPrefs('_user').vip) {
					_suxiangw_msg({
							content: '加入VIP特权免费开直播！'
					});
					return;
			}
			_url({
					url: 'zhibo_add',
					title: '开直播'
			});
		}else{
			_zurl(data)
		}
	}
	// 打开直播
	function _zurl(data) {
		var name = 'zhibo_view_win';
		api.openWin({
			name: name,
			url: _h_w + name + '.html',
			bounces: false,
			//	pageParam : pageParam,
			reload: true,
			allowEdit: true,
			slidBackEnabled: false,
			pageParam: data,
			// animation : {
			// 	type : "fade", //动画类型（详见动画类型常量）
			// 	subType : "from_right", //动画子类型（详见动画子类型常量）
			// 	duration : 300
			// },
		});
	}
	// 缓存直播礼物图片
	function zhibo_liwu_img() {
			var srcs = _getPrefs('_config').liwu
      for (var i = 0; i < srcs.length; i++) {
				api.imageCache({
						url: _sx_qiniu+srcs[i].img+'?imageView2/1/w/100/format/png',
						thumbnail: false
				}, function(ret, err) {
						if (ret) {
								// console.log(	ret.url )
						}
				});
      }
	}
	function a(_this){
		var urldata = $(_this).data('url');
		if(urldata == url){
			return;
		}else{
			url = urldata;
		}
		$('.tags .a').removeClass('a');
		$(_this).addClass('a');
		_list({url:url,loading:1});
	}
	// 设置高度
	function header(h){
		h = h + 15
		$('.tags').css('padding-top',h+'px');
	}
</script>

</html>
